<#assign pageTitle = "${course.courseName}-${siteCompany.siteName!}" />
<#assign pageKeywords = "${course.courseName},${channel.channelName!}" />
<#assign channelId = course.channelId />
<#assign pageHeader>
    <style>
        .list-article-img {
            height: 300px;
        }
        @media screen and (max-width: 1680px){
            .list-article-img {
                height: 230px;
            }
        }
    </style>
</#assign>
<#assign pageContent>
    <div class="body-wrap">
        <div class="course-info-header">
            <div class="content-wrap">
                <div class="crumbs">
                    <i class="layui-icon layui-icon-home"></i>
                    <a href="/index.html" target="_blank">首页</a>
                    <span class="sep">/</span>
                    <a href="${channel.linkUrl!}" title="${channel.channelName!}"
                       target="_blank">${channel.channelName!}</a>
                    <span class="sep">/</span>
                    课程详情
                </div>
                <a class="layui-btn layui-btn-radius layui-btn-sm btn-collect">
                    <i class="layui-icon layui-icon-share"></i> 分享
                </a>
                <#if isFavorite?string == "true">
                    <a id="favorite-id" class="layui-btn layui-btn-radius layui-btn-sm btn-collect">
                        <i class="layui-icon layui-icon-star"></i> <span onclick="deleteFavorite(${course.courseId},2,this)" >取消收藏</span>
                    </a>
                <#else>
                    <a id="favorite-id"  class="layui-btn layui-btn-radius layui-btn-sm btn-collect">
                        <i class="layui-icon layui-icon-star"></i> <span onclick="favorites(${course.courseId},2,this)">收藏</span>
                    </a>
                </#if>
                <div class="title">${course.courseName}</div>
                <div class="info">${course.intro!}</div>
                <div class="fixed-wrap">
                    <div class="con">
                        <div class="time-price clearfix">
                            <div class="no-discount clearfix">
                                <#if course.price gt 0>
                                    <div class="ori-price">
                                        ￥${course.price/100} 元
                                    </div>
                                    <del>￥${course.sourcePrice/100} 元</del>
                                <#else>
                                    <div class="ori-price">免费</div>
                                </#if>
                            </div>
                        </div>
                        <div class="info-bar clearfix" style="margin-top:0px">
                            <span>分类</span>
                            <span class="nodistance">${course.categoryName}</span>
                            <i>/</i>
                            <span>浏览</span>
                            <span class="nodistance">${course.viewCount}</span>
                        </div>
                        <div class="btns js-btns">
                            <#if isBuy?string == 'true'>
                                <a href="/user/course/play.html?courseId=${course.courseId}" class="layui-btn layui-btn-radius layui-btn-lg layui-btn-danger">
                                    继续学习
                                </a>
                            <#else>
                                <a href="javascript:void(0)" onclick="buyCourse(${course.courseId})" class="layui-btn layui-btn-radius layui-btn-lg layui-btn-danger">
                                    我要学习
                                </a>
                            </#if>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="content-wrap">
            <div class="course-info-wrap">
                <div class="course-info-tab mb-20">
                    <div class="layui-tab layui-tab-brief" lay-filter="courseInfoTab">
                        <ul class="layui-tab-title">
                            <li class="layui-this">课程介绍</li>
                            <#if courseNodeTree?? && courseNodeTree?size gt 0>
                                <li>章节目录</li>
                            </#if>
                            <#if courseFiles?? && courseFiles?size gt 0>
                                <li>相关资料</li>
                            </#if>
                        </ul>
                        <div class="layui-tab-content">
                            <div class="layui-tab-item layui-show">
                                <div class="course-info-context">
                                    ${course.context!}
                                </div>
                                <div class="declare-info mt-20 clearfix">
                                    声明：版本声明：本课程已获作者独家授权，未经许可，不得转载或重新改编，不得用于商业用途，一经发现，将追究相应法律责任并赔偿相应损失！
                                </div>
                            </div>
                            <#if courseNodeTree?? && courseNodeTree?size gt 0>
                                <div class="layui-tab-item">
                                    <div class="menu-list view-menu-list">
                                        <#list courseNodeTree as item>
                                            <dl class="menu-item">
                                                <dt><span class="name"><strong>${item.name!}</strong></span><i class="layui-icon layui-icon-up"></i></dt>
                                                <#if item.children?? && item.children?size gt 0>
                                                    <#list item.children as child>
                                                        <dd>
                                                            <span class="number">${child_index+1}.</span>
                                                            <i class="layui-icon layui-icon-play"></i>
                                                                <#if child.free==1>
                                                                     <a class="name" href="/user/course/play.html?nodeId=${child.nodeId}">${child.name!}</a>
                                                                     <a class="time" href="/user/course/play.html?nodeId=${child.nodeId}">
                                                                        <span class="time"><i class="layui-icon layui-icon-ok-circle"></i>免费看</span>
                                                                     </a>
                                                                <#else>
                                                                    <a class="name" onclick="videoPlay(${child.courseId},${child.nodeId})" href="javascript:void(0)">${child.name!}</a>
                                                                    <a class="time" onclick="videoPlay(${child.courseId},${child.nodeId})" href="javascript:void(0)">
                                                                        <span class="time">
                                                                         <#if child.progress gt 0>
                                                                             <i class="layui-icon layui-icon-ok-circle"></i>已学习
                                                                         <#else>
                                                                             <i class="layui-icon layui-icon-reduce-circle"></i>未学习
                                                                         </#if>
                                                                        </span>
                                                                    </a>
                                                                </#if>
                                                        </dd>
                                                    </#list>
                                                </#if>
                                            </dl>
                                        </#list>
                                    </div>
                                </div>
                            </#if>
                            <#if courseFiles?? && courseFiles?size gt 0>
                                <div class="layui-tab-item">
									<div class="menu-list view-menu-list">
										<dl class="menu-item">
											<dt><span class="name"><strong>相关资料</strong></span><i class="layui-icon layui-icon-up"></i></dt>
											<#list courseFiles as item>
												<dd><span class="number">1.</span><i class="layui-icon layui-icon-file"></i><span class="name">${item.title!}</span><span class="time" onclick="downloadFile(${item.id})">点击下载</span></dd>
											</#list>
										</dl>
									</div>
                                </div>
                            </#if>
                        </div>
                    </div>
                </div>
                <div class="course-other mb-20">
                    <div class="title">学过该课程的人还在学</div>
                    <div class="articles-list">
                        <#if courseList?? && courseList?size gt 0>
                            <#list courseList as item>
                                <div class="list-items">
                                    <div class="list-item">
                                        <div class="list-content">
                                            <a href="/course/view/${item.courseId}.html" target="_blank" class="list-article-img"><img lay-src="${item.cover!}" alt=""></a>
                                            <a href="/course/view/${item.courseId}.html" target="_blank" class="list-article-title">${item.courseName!}</a>
                                            <div class="list-article-info">${item.intro!}</div>
                                            <div class="list-article-price">
                                                <#if item.price gt 0>
                                                    ￥${item.price/100}
                                                <#else>
                                                    免费
                                                </#if>
                                            </div>
                                            <div class="list-article-type">${item.categoryName!}</div>
                                        </div>
                                    </div>
                                </div>
                            </#list>
                        </#if>
                    </div>
                </div>
            </div>
            <div class="course-info-right course-view-right">
                <#if teachers??>
                    <div class="course-author white-bg mb-20">
                        <div class="content-title"><h3>课程主讲</h3></div>
                        <#list teachers as teacher>
                        <div class="content-author">
                            <div class="author-img" style="margin-top: 30px"><a href="/teacher/view/${teacher.id}.html" target="_blank"><img src="${teacher.avatar!}" alt=""></a></div>
                            <div class="author-name">
                                <strong>${teacher.name!}</strong>
                                <#if teacher.starId==2>
                                    （助教）
                                <#elseif teacher.starId==2>
                                    （讲师）
                                <#elseif teacher.starId==3>
                                    （高级讲师）
                                <#elseif teacher.starId==4>
                                    （副教授）
                                <#elseif teacher.starId==5>
                                    （教授）
                                <#else >
                                    （讲师）
                                </#if>
                            </div>
                            <div class="author-info">${teacher.intro!}</div>
                        </div>
                        </#list>
                    </div>
                </#if>
                <#if book??>
                    <div class="course-related white-bg mb-20">
                        <div class="content-title"><h3>同步教材</h3></div>
                        <div class="list-item">
                            <div class="list-content">
                                <a href="/book/view/${book.id}.html" target="_blank" class="list-book-img">
                                    <img lay-src="${book.cover}" alt="">
                                </a>
                                <div class="list-book-content">
                                    <a href="/book/view/${book.id}.html" target="_blank"
                                       class="list-book-title">${book.title!}</a>
                                    <div class="list-book-info">${book.intro!}</div>
                                    <div class="list-book-type">${book.categoryName!}</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </#if>
				<#if courseList?? && courseList?size gt 0>
                	<div class="course-related white-bg mb-20">
                    <div class="content-title"><h3>相关课程</h3></div>
                    <div class="course-list-strip">
						<#list courseList as item>
							<a href="/course/view/${item.courseId}.html">
								<span class="fl">${item.courseName!}</span>
								<span class="fr">${item.categoryName!}</span>
							</a>
						</#list>
                    </div>
                </div>
				</#if>
            </div>
        </div>
    </div>
</#assign>
<#assign pageFooter>
    <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
    <script type="text/javascript" src="/static/libs/jquery/jquery.qrcode.min.js"></script>
    <script type="text/javascript" src="/static/js/parabola.js"></script>
    <script type="text/javascript" src="/static/js/order.js?v=1"></script>
    <script type="text/javascript" src="/static/js/course/course-view.js?v=1"></script>
    <script type="text/javascript">
        var userId = ${userId};
        var isFavorite = ${isFavorite?string};
        var isBuy = ${isBuy?string};

        function videoPlay(courseId,nodeId) {
            if(isBuy){
                location.href = "/user/course/play.html?courseId=" + courseId + "&nodeId=" + nodeId;
            }else {
                buyCourse(courseId)
            }
        }

        //鼠标滑动固定下载按钮
        var listHeaderTop = $('.fixed-wrap').offset().top - 32;
        $(window).scroll(function () {
            if($(document).scrollTop() >= listHeaderTop){
                $('.fixed-wrap').addClass('fixed')
            }else {
                $('.fixed-wrap').removeClass('fixed')
            }
        });
    </script>
</#assign>
<#include "../layouts/layout.ftl">